<template>
  <div id="contractDetail">
    <el-table
      ref="table"
      row-key="id"
      :data="data.procurementProductList"
      border
      :header-cell-style="{ background: '#f5f7fa' }"
    >
      <el-table-column label="物品名称" prop="productName"> </el-table-column>
      <el-table-column label="规格型号" prop="specificationName">
      </el-table-column>
      <el-table-column label="预计到货数量" prop="financeBuyNum">
      </el-table-column>
      <el-table-column label="实际到货数量" prop="actualNum">
        <template #default="scope">
          <el-input
            v-model="scope.row.actualNum"
            clearable
            placeholder="请输入实际到货数量"
          ></el-input>
        </template>
      </el-table-column>
      <el-table-column label="单位" prop="unitName"> </el-table-column>
    </el-table>
    <el-button type="primary" plain icon="el-icon-plus" @click="showSelectGoods"
      >其他到货</el-button
    >

    <sc-form-table
      ref="table"
      v-model="otherGoods"
      placeholder="暂无数据"
      :hideAdd="true"
      stripe
      border
      v-if="otherGoods.length != 0"
    >
      <!-- :showSummary="true" -->
      <el-table-column label="物品名称" prop="name"> </el-table-column>
      <el-table-column label="规格型号" prop="spuSpecification">
      </el-table-column>
      <el-table-column label="到货数量" prop="actualNum">
        <template #default="scope">
          <el-input
            v-model="scope.row.actualNum"
            clearable
            placeholder="请输入到货数量"
          ></el-input>
        </template>
      </el-table-column>
      <el-table-column label="单位" prop="productUnitName"> </el-table-column>
    </sc-form-table>

    <div class="button">
      <el-button type="primary" @click="save" :loading="isSaveing"
        >确 定</el-button
      >
      <el-button @click="cencel">取 消</el-button>
    </div>

    <!-- 选择物品 -->
    <select-goods ref="selectGoods" @selectGoods="selectGoods"></select-goods>
  </div>
</template>
<script>
import selectGoods from '../../../components/selectGoods'
export default {
  name: 'pendingArrival',
  data () {
    return {
      isSaveing: false,
      goodsList: [],//物品列表
      otherGoods: []//其他添加到货物品
    }
  },
  components: {
    selectGoods
  },
  props: {
    data: {
      type: Object,
      required: true
    }
  },
  methods: {
    // 显示物品选择列表
    showSelectGoods () {
      this.$refs.selectGoods.open()
    },

    // 其他到货物品列表
    selectGoods (list) {
      list.map(item => {
        item.actualNum = ''
      })
      this.otherGoods = [...this.otherGoods, ...list]
    },

    // 添加
    async save () {
      let param = {}
      this.userInfo = this.$TOOL.data.get('USER_INFO')
      param.adminId = this.userInfo.userId
      param.id = this.data.id

      let noNum = false
      this.otherGoods.map(item => {
        item.productSpuId = item.id
        item.productName = item.name
        item.specificationName = item.spuSpecification
        item.unitName = item.productUnitName
        delete item.id
        // delete item.name
        // delete item.spuSpecification
        // delete item.productUnitName
        if (item.actualNum == '') {
          noNum = true
          this.$message.error(`请输入${item.productName}的到货数量`)
        }
      })

      console.log(this.otherGoods)
      param.procurementProductList = [...this.data.procurementProductList, ...this.otherGoods]
      console.log(param)
      if (noNum) return

      this.isSaveing = true
      let res = await this.$API.purchase.receiptDoods.post(param)
      this.isSaveing = false
      if (res.code == 200) {
        this.closeSelectedTag(this.$route)
        this.$router.push({
          path: '/goods/purchaseManagement'
        })
        this.$message.success("操作成功")
      } 

    },

    cencel () {
      this.closeSelectedTag(this.$route)
      this.$router.push({
        path: '/inventory/receive'
      })
    },
    //关闭tag
    closeSelectedTag (tag) {
      this.$store.commit("removeViewTags", tag)
      this.$store.commit("removeIframeList", tag)
      this.$store.commit("removeKeepLive", tag.name)
    },
  }

}
</script>
<style lang='scss' scoped>
.el-button {
  margin: 15px 15px 15px 0;
}
</style>